<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="./js/jquery-3.6.0.js"></script>
    <script src="./js/jquery.validate.min.js"></script>
    <script src="./js/messages_zh.min.js"></script>
  </head>
  <body>
    <head>
      <style>
        .error {
          color: red;
        }
      </style>
    </head>
    <body>
      <div id="box">
        <form action="success.html" id="registerForm">
          <div>
            <label>用户名</label>
            <input type="text" name="username" required minlength="8" />
          </div>
          <div>
            <label>密码</label>
            <input type="password" name="pwd" id="password" required />
          </div>

          <div>
            <label>确认密码</label>
            <!--equalTo="#id值"-->
            <input type="password" name="rePwd" equalTo="#password" />
          </div>

          <div>
            <label>年龄</label>
            <input type="number" name="age" min="0" max="150" />
          </div>

          <div>
            <label>手机号码</label>
            <input type="text" name="phone" />
          </div>
          <div>
            <input type="submit" value="注册" />
          </div>
        </form>
      </div>
    </body>
</html>
<script>
  $(function () {
    $('#registerForm').validate()
  })
</script>